<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>健康分析</title>
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css') }}">
    <style>
        .section {
            padding: 20px;
            background: #fff;
            margin: 20px auto;
            max-width: 800px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        }

        .analysis-section {
            margin-bottom: 20px;
        }

        .analysis-section img {
            display: block;
            width: 100%;
            margin-bottom: 10px;
            border: 1px solid #ccc;
            border-radius: 8px;
        }

        .form-group {
            margin-bottom: 15px;
        }

        .form-group input {
            width: 100%;
            padding: 10px;
            margin-top: 5px;
            border: 1px solid #ddd;
            border-radius: 5px;
        }

        button {
            background-color: #0066cc;
            color: white;
            padding: 10px 15px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }

        button:hover {
            background-color: #004080;
        }
    </style>
</head>
<body>

<header>
    <h1>老年人健康档案服务平台</h1>
</header>

<!-- 导航栏 -->
<nav>
    <div>
        <a href="{{ url_for('index') }}">首页</a>
	<a href="{{ url_for('health_data') }}">健康档案</a>
	<a href="{{ url_for('health_analysis') }}">健康分析</a>
	<a href="{{ url_for('personal_advice') }}">个性化建议</a>
	<a href="{{ url_for('community') }}">健康社区</a>
	<a href="{{ url_for('contact') }}">联系我们</a>

    </div>
    <div class="search-bar">
        <input type="text" id="search-input" placeholder="全文搜索...">
        <button onclick="searchArticles()">搜索</button>
    </div>
</nav>

<!-- 健康分析 -->
<div class="section" id="health-analysis">
    <h2>健康分析</h2>
    <p>基于您的健康档案，我们生成如下分析结果，帮助您了解健康状况。</p>

    <!-- 健康报告解析 -->
    <div class="analysis-section">
        <h3>上传报告解析</h3>
        <input type="file" id="analysis-report" accept=".pdf, .jpg, .png">
        <button onclick="analyzeReport()">解析报告</button>
        <p id="report-message" style="color: green; margin-top: 10px;"></p>
    </div>

    <!-- 动态趋势图 -->
    <div class="analysis-section">
        <h3>健康趋势图</h3>
        <img id="trend-chart" src="https://via.placeholder.com/600x300?text=%E8%A1%80%E5%8E%8B%E8%B6%8B%E5%8A%BF%E5%9B%BE" alt="趋势图">
        <button onclick="updateChart()">更新趋势图</button>
    </div>

    <!-- 风险提示 -->
    <div class="analysis-section">
        <h3>风险提示</h3>
        <ul id="risk-tips">
            <li>血压水平正常，无需特别注意。</li>
            <li>血糖值略高，建议控制糖分摄入。</li>
            <li>心率正常，保持良好的运动习惯。</li>
        </ul>
        <button onclick="generateTips()">生成新风险提示</button>
    </div>
</div>

<!-- 页脚 -->
<footer>
    <p>© 2024 老年人健康档案服务平台 | 地址: 北京市某区某街道100号</p>
    <p>友情链接: <a href="https://www.who.int" target="_blank">世界卫生组织</a> | <a href="https://www.nhc.gov.cn" target="_blank">国家卫生健康委员会</a></p>
</footer>

<script>
    // 解析健康报告
    function analyzeReport() {
        const reportInput = document.getElementById('analysis-report');
        const reportMessage = document.getElementById('report-message');

        if (reportInput.files.length > 0) {
            reportMessage.textContent = '报告解析成功！健康数据已更新。';
            reportInput.value = ''; // 清空文件选择
        } else {
            reportMessage.textContent = '请先选择健康报告文件！';
        }
    }

    // 更新趋势图
    function updateChart() {
        const chart = document.getElementById('trend-chart');
        chart.src = "https://via.placeholder.com/600x300?text=%E5%9B%BE%E8%B6%8B%E6%9B%B4%E6%96%B0%E4%B8%AD..."; // 模拟动态更新
        setTimeout(() => {
            chart.src = "https://via.placeholder.com/600x300?text=%E6%96%B0%E5%8A%BF%E5%8A%BF%E5%9B%BE"; // 更新完成
        }, 2000);
    }

    // 动态生成风险提示
    function generateTips() {
        const tipsList = document.getElementById('risk-tips');
        tipsList.innerHTML = `
            <li>血压略高，建议减少盐分摄入。</li>
            <li>血糖值维持正常水平，请继续保持健康饮食。</li>
            <li>心率偏低，建议进行适当有氧运动。</li>
        `;
    }
</script>

<script>
    // 搜索功能，跳转至健康社区页面并传递搜索关键词
    function searchArticles() {
        const query = document.getElementById('search-input').value.trim();
        if (query) {
            window.location.href = "{{ url_for('community') }}?search=" + encodeURIComponent(query);
        } else {
            alert('请输入搜索内容！');
        }
    }
</script>


</body>
</html>
